<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>

<script>
    function Fruit(name) { // 父类构造函数
        this.name = name;
        this.play = [1, 2, 3];
    }
    // 父类原型上定义方法
    Fruit.prototype.intro = function (color) {
        console.log(this.name + ' is ' + color);
    }

    // 1. 原型链式继承
    function Apple1(name) { }

    Apple1.prototype = new Fruit();
    // Apple.name = 'asdf' // 会报错
    Apple1.prototype.name = 'apple'; // 只能继续在原型上添加参数

    var s1 = new Apple1();
    var s2 = new Apple1();

    s1.play.push(4);
    console.log(s1.play, s2.play); // [1,2,3,4] [1,2,3,4]

    // console.log(s1);
    // console.log(s1.prototype); 

    // 2. 构造函数继承
    function Apple2(name, color) {
        Fruit.call(this, name); // key
        this.name = name;
        this.color = color;
    }
    // 只能在自己的原型上定义函数，无法调用父类原型上的方法
    // Apple2.prototype.intro = function () {
    //     console.log("this", this);
    // }

    var apple2 = new Apple2('apple', 'red');
    console.log(apple2.name);
    // apple2.intro() // 会报错

    // 3. 实例继承
    function Apple3(name, color) {
        var o = new Fruit(name);
        o.color = color;
        console.log("this", o.__proto__);
        return o;
    }
    var apple3 = new Apple3('apple3', 'red');
    var apple33 = new Apple3('apple33', 'red');
    console.log("apple3", apple3);
    console.log("apple33", apple33);
    console.log(apple3.__proto__);
    console.log(Apple3.prototype);
    console.log(apple3.__proto__ === apple33.__proto__);



    // =================== class 继承 ===================
    console.log("======= class 继承 =======");
    class Student {
        constructor(sname, sage) {
            this.sname = sname;
            this.sage = sage;
        }
        static className = '高三15班';
        intro() {
            console.log(`我是${this.sname}, 今年${this.sage}岁`);
        }
    }
    var stu1 = new Student('zc', 24);
    var stu2 = new Student('lsr', 24);
    stu1.intro();
    console.log(stu1);
    console.log(stu2);

    stu1.className = '改变了班级'

    

</script>

</html>